<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head th:include="css :: css">
</head>
<link href="/js/jquery.icheck/skins/square/blue.css" rel="stylesheet">

<body style="opacity: 1">
<div style="padding-top: 0">
    <div class="container-fluid">
        <div class="cl-mcont">
            <div class="row">
                <div class="col-md-12" style="padding:0">
                    <div class="block-flat">
                        <form class="form-inline group-border-dashed" id="buyCode">
                            <div class="form-group">
                                <label for="codeNum">工号:</label>
                                <input type="text" class="form-control" id="codeNum"/>
                            </div>&nbsp;
                            <div class="form-group">
                                <label for="operator">状态:</label>
                                <select class="form-control" id="state" name="state">
                                    <option value="">全部</option>
                                    <option value="0">开启</option>
                                    <option value="1">关闭</option>
                                </select>
                            </div>&nbsp;
                            <div class="form-group">
                                <label for="operator">运营商:</label>
                                <select class="form-control" id="operator" name="productType">
                                </select>
                            </div>&nbsp;
                            <div class="form-group">
                                <button class="btn btn-primary" type="button" id="search"><i
                                        class="fa fa-search"></i>查询
                                </button>
                            </div>
                            <div class="form-group">
                                <button class="btn btn-default" type="button" id="export"><i
                                        class="fa fa-key"></i>开启
                                </button>
                            </div>

                        </form>
                    </div>
                    <div class="block-flat">
                        <div class="content">
                            <div class="table-responsive">
                                <table class="table hover" id="dataTable">
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>


</div>
<div th:include="js :: js"></div>
<script type="text/javascript" th:attr="src=@{/js/jquery.form.js}"></script>
<script type="text/javascript" th:attr="src=@{/js/jquery.parser.js}"></script>
<script type="text/javascript" src="js/jquery.icheck/icheck.min.js"></script>
<!--<script type="text/javascript" src="/js/pageJs/order/order.js?deVersion=2018071601"></script>-->
<script type="text/javascript">
    $('#dataTable').bootstrapTable({
        url: '/WorkNumberList/queryReceiveWorkNumber',
        height: $(window).height() - 200,
        pageSize: 30,
        pagination: true,
        pageList: [30, 50, 100],
        clickToSelect: true,
        queryParams: queryParams,
        uniqueId: 'id',
        queryParamsType: '',
        sidePagination: 'server',
        responseHandler: function (res) {
            return {
                "total": res.total,//总页数
                "rows": res.resultList   //数据
            };
        },
        columns: [
            [{checkbox: true}, {
                width: '3px',
                align: 'center',
                formatter: function (v, row, index) {
                    return index + 1
                }
            },
                {
                    field: 'workNumber', title: '工号', width: 150, align: 'center'
                },
                {
                    field: 'state', title: '状态', width: 100, align: 'center', formatter: function (v, o) {
                        return {0: "开启", 1: "关闭"}[v];
                    }
                },

                {
                    field: 'productType', title: '运营商', width: 100, align: 'center', formatter: function (v, o) {
                        return productTypeConvert(o.productType);
                    }
                },
                {
                    field: 'admin', title: '操作人', width: 100, align: 'center', formatter: function (v, o) {
                        if (v && v != "null") return v
                    }
                },
                {
                    field: 'apiComment', title: '程序返回备注', width: 200, align: 'center', formatter: function (v, o) {
                        if (v && v != "null") return "<label title='" + v + "' class='easyui-tooltip'>" + v + "</label>"

                    }
                },
                {
                    field: 'remark', title: '备注', width: 180, align: 'center', formatter: function (v, o) {
                        if (v && v != "null") return "<label title='" + v + "' class='easyui-tooltip'>" + v + "</label>"

                    }
                },
            ]],
    });
    $("#search").click(function () {
        console.log($("#buyCode").serialize())
        var timeAdd = new Date($("#buyStartTime").val());
        var timeEnd = new Date($("#buyEndTime").val());
        if (timeAdd > timeEnd) {
            layer.msg("开始时间不能大于结束时间");
            return false;
        }
        var require = (timeEnd - timeAdd) / (1 * 24 * 60 * 60 * 1000);
        if (require > 7) {
            layer.msg("时间间隔不能超过7天")
            return;
        }
        $("#dataTable").bootstrapTable("refresh");
    });
    $(function () {
        $.ajax({
            type: "POST",
            url: "/CardProductController/queryAllCardOperatorList",
            dataType: "json",
            success: function (data) {
                $("#operator").html("");
                var str = "<option value=\"\">全部</option>";
                if (data != null && data.length > 0) {
                    for (var i = 0; i < data.length; i++) {
                        str += '<option value=' + data[i].cardOperatorId + '>' + data[i].cardOperatorName + '</option>'
                    }
                }
                $("#operator").append(str);
            },
            beforeSend: function () {
            }
        });
    })
    function queryParams(params) {
        return {
            productType: $('#operator').val(),
            state: $("#state").val(),
            workNumber: $("#codeNum").val(),
        };
    }
</script>
</body>
</html>
